import React, { Component } from 'react'
// WrappedComponent 用来接收需要使用Demo组件中状态和逻辑的组件. 本质上就是一个形参,只是行业中一般都叫这个名字
export default function withDemo(WrappedComponent) {
  return class extends Component {
    static displayName = 'With' + WrappedComponent.name

    state = {
      username: '',
      password: '',
      repassword: '',
    }

    handleChange = (name) => {
      return (e) => {
        this.setState({
          [name]: e.target.value,
        })
      }
    }
    render() {
      console.log(this.props)
      return (
        <WrappedComponent
          // 将状态里面的所有数据以props的形式传递给WrappedComponent组件
          {...this.state}
          {...this.props}
          handleChange={this.handleChange}
        ></WrappedComponent>
      )
    }
  }
}
